<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript" src="../../jQuery-JS/jquery-3.6.0.js"></script>
    <script type="text/javascript" src="../../jQuery-JS/jQuery-plugin.js"></script>
    <script type="text/javascript">
        /*
        需求：
        1.给$添加四个工具方法
          min(a,b) 返回较小的值
          max(c,d) 返回较大的值
          leftTrim() 去掉字符串左边的空格
          rightTrim() 去掉字符串右边的空格
        */
        /*
        给jQuery对象添加3个功能方法
        checkAll() 全选
        unCheckAll() 全不选
        reverseCheck() 全反选
        */
        $(function(){
            console.log($.min(3,6),$.max(55,66));

            var string="   my   gui   gu   ";
            console.log($.leftTrim(string));
            console.log($.rightTrim(string));

            var $items=$(":checkbox[name=items]");
            var $checkedAllBtn=$("#checkedAllBtn");
            var $checkedNoBtn=$("#checkedNoBtn");
            var $checkedRevBtn=$("#checkedRevBtn");
            $checkedAllBtn.click(function(){
                $items.checkAll()
            })
            $checkedNoBtn.click(function(){
                $items.unCheckAll()
            })
            $checkedRevBtn.click(function(){
                $items.reverseCheck()
            })
        })
    </script>
</head>
<body>
    <!--
        1.扩展插件
          扩展jQuery的工具方法
          $.extend(object)
          扩展jQuery对象的方法
          $.fn.extend(object)
    -->
    <input type="checkbox" name="items" value="足球">足球
    <input type="checkbox" name="items" value="篮球">篮球
    <input type="checkbox" name="items" value="羽毛球">羽毛球
    <input type="checkbox" name="items" value="乒乓球">乒乓球
    <input type="checkbox" name="items" value="排球">排球
    <br>
    <input type="button" id="checkedAllBtn" value="全  选">
    <input type="button" id="checkedNoBtn" value="全不选">
    <input type="button" id="checkedRevBtn" value="反  选">
</body>
</html>